@extends('layouts.root')

@section('title' , '客户后台')


<!-- 主体内容 -->
@section('contents')
    <!-- 主体内容 -->
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-body" pad15>

                        <div class="layui-form layui-row layui-col-space10 layui-form-item" lay-filter="">
                            <div class="layui-form-item">
                                <label class="layui-form-label">商品名称</label>
                                <div class="layui-input-block">
                                    {{--readonly--}}
                                    <input type="text" name="goods_name" value="{{ $goods->goods_name ?? '' }}"
                                           placeholder="请输入商品名称" lay-verify="required" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">价格</label>
                                <div class="layui-input-block">
                                    <input type="text" name="price" value="{{ $goods->price ?? '' }}" lay-verify="digits" autocomplete="off"
                                           placeholder="请输入价格" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">商品编码</label>
                                <div class="layui-input-block">
                                    <input type="text" name="goods_code" value="{{ $goods->goods_code ?? '' }}" autocomplete="off"
                                           placeholder="商品编码(不填可为空)" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">图片</label>
                                <div class="layui-input-inline">
                                    <input name="goods_img" id="LAY_avatarSrc" placeholder="图片地址" value="{{ $goods->goods_img ?? '' }}"
                                           class="layui-input">
                                </div>
                                <div class="layui-input-block layui-btn-container" style="width: auto;">
                                    <button type="button" class="layui-btn layui-btn-primary" id="LAY_avatarUpload">
                                        <i class="layui-icon">&#xe67c;</i>上传图片
                                    </button>
                                    <img src="{{ $goods->goods_img ?? '' }}" height="50" id="img_avatar" alt="">
                                </div>
                            </div>

                            {{--<div class="layui-form-item layui-form-text">--}}
                                {{--<label class="layui-form-label">备注</label>--}}
                                {{--<div class="layui-input-block">--}}
                                    {{--<textarea name="remarks" placeholder="请输入备注" class="layui-textarea"></textarea>--}}
                                {{--</div>--}}
                            {{--</div>--}}
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn" lay-submit lay-filter="setmyinfo">确认</button>
                                    {{--<button type="reset" class="layui-btn layui-btn-primary">重新填写</button>--}}
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection


@section('scripts')
    <script>
        layui.config({
            base: '/layuiadmin/'
        }).extend({
            index: 'lib/index',
        }).use(['index','form','upload'],function(){
            var $ = layui.$
                ,form = layui.form
                ,upload = layui.upload
                ,layer = layui.layer;


            layer.closeAll();
            //监听提交
            form.on('submit(setmyinfo)', function(data){
                var field = data.field;

                $.post({
                    @if($goods)
                        method:'PATCH',
                        url: '{{ route('zbsuser.goods.update' , $goods->id) }}'
                    @else
                        method:'POST',
                        url: '{{ route('zbsuser.goods.store') }}'
                    @endif
                    ,data: field
                    ,dataType:'json'
                    ,success:function(res){
                        if (res.code){
                            layer.msg(res.msg , {icon:6,time:1000},function(){
                                parent.layer.closeAll();
                            });
                        }else{
                            layer.msg(res.msg , {icon:5,time:1500},function(){});
                        }

                    }
                    ,error:function(err){
                        var parseJSON = err.responseJSON.errors;
                        var html = '';
                        $.each(parseJSON , function(k , v){
                            html += v + '<br>';
                        });
                        layer.msg(html , {icon:5,time:1500})
                    }
                })
            });

            //普通图片上传
            var uploadInst = upload.render({
                elem: '#LAY_avatarUpload'
                ,url: '{{ route('zbsuser.index.upImage') }}' //
                ,before: function(obj){
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
                        //$('#LAY_avatarSrc').attr('value', result); //图片链接（base64）
                    });
                }
                ,done: function(res){
                    //如果上传失败
                    if(res.code <= 0){
                        return layer.msg('上传失败',{time:1500});
                    }else{
                        $('#LAY_avatarSrc').attr('value', res.path);
                        $('#img_avatar').attr('src', res.path);
                        return layer.msg('上传成功',{time:1000});
                    }
                }
                ,error: function(){
                    //演示失败状态，并实现重传
                    var demoText = $('#demoText');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function(){
                        uploadInst.upload();
                    });
                }
            });
        });
    </script>
@endsection